<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>日期检测</title>
<style>
.red{color:red};
.green{color:green};

</style>

<script>
//1: 1993-03-28;
//2: 1993/03/28;

function fn(ele){
     return document.querySelector(ele);
 }
 window.onload=function(){

var reg=/(\d+)(-)/g  //全局匹配至少一个数字，匹配一个横杠 匹配结果：2013- 6-

fn('.txt').addEventListener('keyup',function(){ //keyup:按键弹起
        if(reg.test(this.value)){
            fn('.text').innerText="日期输入正确"
            fn('.text').className='text green'
        }else{
            fn('.text').innerText="请输入正确的日期格式！正确格式：2019-05-10"
            fn('.text').className='text red'
        }
    },false);
 }


</script>
</head>
<body>
<input type="text" class="txt"><span class="text"></span>    
</body>
</html>